<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    <script src="./libs/jquery-1.12.4.min.js"></script>
  </head>
  <body>
    <button id="all">获取全部</button>
    <div class="box"></div>
    <!-- <ul>
      <li>名字</li>
      <li>技能</li>
      <li>故事</li>
      <li><img src="" alt="" /></li>
    </ul> -->
  </body>
  <script>
    $("#all").on("click", () => {
      $.ajax({
        url: "http://127.0.0.1:3000/all",
        success: function(response) {
          console.log(response);

          const data = response.data.map(function(item) {
            return `  <ul>
        <li>${item.name}</li>
        <li>${item.skill}</li>
        <li>${item.tale}</li>
        <li><img src="${item.wallpaper}" alt=""></li>
    </ul>`;
          });
          $(".box").html(data);
        }
      });
    });
  </script>
</html>
